<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
		<title>Hr分析</title>
		<link rel="stylesheet" type="text/css" href="../../css/api.css"/>
		<link rel="stylesheet" type="text/css" href="../../css/base.css"/>
	
		<style>
			.div-style {
				width: 100%;
				height: 360px
			}
			.mui-btn-blue, .mui-btn-primary, input[type=submit] {
				color: #fff;
				background-color: #FF9900;
				border: 1px solid #FF9900;
			}
			p {
				font-size: 14px;
				margin-top: 0;
				/* margin-bottom: 10px; */
				color: #8f8f94;
			}
			.mui-btn, button, input[type=button], input[type=reset], input[type=submit] {
				font-size: 14px;
				font-weight: 400;
				line-height: 1.42;
				position: relative;
				display: inline-block;
				margin-bottom: 0;
				padding: 6px 12px;
				cursor: pointer;
				-webkit-transition: all;
				transition: all;
				-webkit-transition-timing-function: linear;
				transition-timing-function: linear;
				-webkit-transition-duration: .2s;
				transition-duration: .2s;
				text-align: center;
				vertical-align: top;
				white-space: nowrap;
				color: #fff;
				border: 1px solid #ccc;
				border-radius: 3px;
				border-top-left-radius: 3px;
				border-top-right-radius: 3px;
				border-bottom-right-radius: 3px;
				border-bottom-left-radius: 3px;
		
				background-clip: padding-box;
			}
			button, html input[type=button], input[type=reset], input[type=submit] {
				cursor: pointer;
				-webkit-appearance: button;
			}
			button, select {
				text-transform: none;
			}
			button {
				overflow: visible;
			}
		</style>
	</head>
	<body>
		<div class="base_style_color base_title_Immerse" id='BarAppearance ' ></div>
		<div class="base_navigation_bar base_style_color base_navigation_item_bar base_title_position" >
			<a class="base_left_item" href="#" onclick="backClick()"> <img class="base_back_icon" src="../../image/icon_jiantou.png" alt=""> </a>
			<span>分析</span>
			<a class="base_right_item base_hide_item"   ></a>
		</div>
		<div id="enterprise_chart"  class="div-style" style="margin-top:66px;"></div>
		<div id="job_chart"  class="div-style" ></div>
		<div class="detailsBtn">
			<button  id="toAnalysisDetail" type="button" class="mui-btn mui-btn-primary" >
				查看详情
			</button>
			<p>
				注：仅统计实习中的学生
			</p>
		</div>
	</body>
	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript" src="../../script/MD5.js"></script>
	<script src="../../script/jquery.min.js" type="text/javascript"></script>
	<script type="text/javascript" src="../../script/requestTool.js"></script>
	<script type="text/javascript" src="../../script/echarts.min.js"></script>
	<script src="../../script/common.js"></script>
	<script type="text/javascript">
		var isone = true;
		
		//是否第一次进入
		apiready = function() {
			loadCategoryOneData();
			sendBuriedNotifi('0', '实习HR分仓', '262');
			setupDetailClick();
		}
		function sendBuriedNotifi(busionessid, pagetype, pagetypeid) {
			var userinfo = {
				uid : $api.getStorage('cfnetppuid'),
				jid : $api.getStorage('cfnetppjid'),
				uname : $api.getStorage('cfnetppusername'),
			}
			var data = {
				busionessid : busionessid,
				pagetype : pagetype,
				pagetypeid : pagetypeid,
				sourceurl : api.pageParam.sourceurl,
				sourcetitle : api.pageParam.sourcetitle,
				accesspageurl : window.location.pathname,
				accesspagetitle : document.title,
				userinfo : userinfo
			}
			SendBehaviorTrajectoriesNotifi_Study(data);
		}

		function backClick() {
			sendBuriedNotifi('1', '实习HR分仓', '262');
			api.closeWin({
			});
		}

		function closewin() {
			api.addEventListener({
				name : 'keyback'
			}, function(ret, err) {
				backClick();
			})
		}

		//一级分类
		function loadCategoryOneData() {
			var param = {
				uid : $api.getStorage('cfnetppuid'),
				jid : $api.getStorage('cfnetppjid'),
			};
			cfnetppPOST(urlHRcompanylst, param, true, function(data, status) {
				if (status == 'success') {
					if (data.code == 200) {
						var categoryArr = data.json;
						if (categoryArr != null && categoryArr.constructor == Array && categoryArr.length > 0) {
							enterpriseChart(categoryArr);
							if (isone) {
								loadCategoryTwoData(categoryArr[0].cid, categoryArr[0].names)
							}
						}
					}
				}
			});
		}

		//二级分类
		function loadCategoryTwoData(cid, name) {
			var param = {
				uid : $api.getStorage('cfnetppuid'),
				jid : $api.getStorage('cfnetppjid'),
				cid : cid
			};
//			console.log(JSON.stringify(param));
			cfnetppPOST(urlHRgwlst, param, true, function(data, status) {
				if (status == 'success') {
					isone = false;
					if (data.code == 200) {
						var categoryArr = data.json;
						//						console.log(JSON.stringify(param));
						if (categoryArr != null && categoryArr.constructor == Array && categoryArr.length > 0) {
							JobChart(categoryArr, name);
						}
					}
				}
			});
		}

		function enterpriseChart(data) {
			var myChart = echarts.init(document.getElementById('enterprise_chart'));
			var companyArr = new Array();
			for (var i = 0; i < data.length; i++) {
				var person = new Object();
				person.value = data[i].num;
				person.name = data[i].names+"岗位:"+data[i].num;
				person.cid = data[i].cid;
//				if(i== 0){
//				person.selected = true;
//				}
				companyArr.push(person);
			}
			option = {
				title : {
					text : '企业分布',
					subtext : '',
					x : 'center'
				},
//				tooltip : {
//					trigger : 'item',
//					formatter : "{a} <br/>{b} : {c} ({d}%)"
//				},
				color : ['#ffcc00', '#09cc33', '#f47878', '#ac76fc', '#ff66cc', '#1269db', '#66cc00', '#ff9900', '#99cc33', '#f16bea'],
				series : [{
					name : '企业',
					type : 'pie',
				     radius : ['50%', '70%'],
					center : ['50%', '50%'],
					data : companyArr,
					avoidLabelOverlap : false,
					funnelAlign : 'right',
					label : {
						normal : {
							show : false,
							position : 'center',
						},
						emphasis : {
							show : true,
							textStyle : {
								fontSize : '14',
								fontWeight : 'bold'
							},
						}
					},
				}]
			}
			myChart.setOption(option);
			myChart.on('click', function(params) {
				var value = params.data;
				var name = value.name
				var array = name.split(":");
				loadCategoryTwoData(value.cid, array[0])
				//								alert(value.name);
				//								console.log(params);
			});
		}

		function JobChart(data, cname) {
			var myChart = echarts.init(document.getElementById('job_chart'));
			var jobArr = new Array();
			for (var i = 0; i < data.length; i++) {
				var person = new Object();
				person.value = data[i].num;
				person.name = data[i].gwname;
				person.gwid = data[i].gwid;
				jobArr.push(person);
			}
			option = {
				title : {
					text : cname + '分布',
					subtext : '',
					x : 'center'
				},
				tooltip : {
					trigger : 'item',
					formatter : "{a} <br/>{b} : {c} ({d}%)"
				},
//				color : [ '#09cc33', '#f47878', '#ac76fc','#ffcc00', '#ff66cc', '#1269db', '#66cc00', '#ff9900', '#99cc33', '#f16bea'],
				series : [{
					name : '岗位',
					type : 'pie',
					radius : ['50%', '70%'],
					center : ['50%', '50%'],
					data : jobArr,
					itemStyle : {
						normal : {
							label : {//此处为指示线文字
								show : false,
							}
						},
					}
				}]
			}
			myChart.setOption(option);
			myChart.on('click', function(params) {
				//	var value = params.data;
				//				alert(value.id);
				//				console.log(params);
			});
		}

		function setupDetailClick() {
			$('#toAnalysisDetail').click(function() {
				SendBehaviorTrajectoriesNotifi1('1', '老师端签到列表', '099', api.pageParam.sourceurl, api.pageParam.sourcetitle, window.location.pathname, document.title);
				api.openWin({useWKWebView:true,
					name : 'HRJobWind',
					url : 'HRJobWind.html',
					//					pageParam : currentClassData
					pageParam : {
						sourceurl : api.pageParam.sourceurl,
						sourcetitle : api.pageParam.sourcetitle,
	
					}
				});
			});
		}
	</script>
</html>